<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html xmlns:th="http://www.thymeleaf.org">
<!--<![endif]-->
<!-- BEGIN HEAD -->

<head>
    <meta charset="utf-8" />
    <title>教师管理-教师列表</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta content="width=device-width, initial-scale=1" name="viewport" />
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="../superui/content/ui/global/bootstrap/css/bootstrap.min.css"
          th:href="@{/superui/content/ui/global/bootstrap/css/bootstrap.min.css}"/>
    <!-- Font Awesome -->
    <link rel="stylesheet" href="../superui/content/ui/global/font-awesome/css/font-awesome.css"
          th:href="@{/superui/content/ui/global/font-awesome/css/font-awesome.css}"/>
    <!-- Theme style -->
    <link rel="stylesheet" href="../superui/content/adminlte/dist/css/AdminLTE.css"
          th:href="@{/superui/content/adminlte/dist/css/AdminLTE.css}"/>
    <link rel="stylesheet" href="../superui/content/adminlte/dist/css/skins/_all-skins.min.css"
          th:href="@{/superui/content/adminlte/dist/css/skins/_all-skins.min.css}"/>
    <link rel="stylesheet" href="../superui/content/min/css/supershopui.common.min.css"
          th:href="@{/superui/content/min/css/supershopui.common.min.css}"/>
    <link rel="stylesheet" href="../superui/content/plugins/bootstrap-table/bootstrap-table.css"
          th:href="@{/superui/content/plugins/bootstrap-table/bootstrap-table.css}"/>
    <link rel="stylesheet" href="../css/global.css"
          th:href="@{/css/global.css}"/>
    <!--全局通用框架样式 end-->
    <!-- bootstrap-switch -->
    <link rel="stylesheet" href="../superui/content/plugins/bootstrap-switch/css/bootstrap-switch.min.css"
          th:href="@{/superui/content/plugins/bootstrap-switch/css/bootstrap-switch.min.css}"/>
    <link rel="stylesheet" href="../../js/assets/lib/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css"
          th:href="@{/js/assets/lib/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css}">
    <!-- iCheck -->
    <link rel="stylesheet" href="../superui/content/plugins/iCheck/square/blue.css"
          th:href="@{/superui/content/plugins/iCheck/square/blue.css}"/>
    <!--上传控件样式-->
    <link rel="stylesheet" href="../js/assets/lib/uploadify/uploadify.css"
          th:href="@{/js/assets/lib/uploadify/uploadify.css}"/>
    <style>
        .course-box .item{
            border-bottom: 1px solid #cccccc;
            padding-bottom: 10px;
            margin: 30px 0;
        }
        .course-box .item:last-child{
            border-bottom: none;
        }
        .course-box .item .teacher-img{
            width: 100%;
            height:128px;
            vertical-align: middle;
            text-align: center;
        }
        .course-box .item .teacher-img img{
            /*width: 150px;*/
            height:100%;
        }
        .course-box .item .title{
            /*font-size: 16px;*/
        }

        .course-box .item .hd{
            /*line-height: 47px;*/
        }
        .course-box .item .bd{
            font-size: 12px;
            margin: 10px 0;
        }
        .course-box .item .bd .col-md-4{
            margin-bottom: 6px;
        }
        .ft-opt a{
            margin-left: 5px;
        }
        .ft-btn {
            margin-left: 5px;
        }
        .price{    color: #F46344;
        }
        .btn-opt i{
            margin-right: 5px;
        }
        .img_list .item{
            position: relative;
            width: 210px;
            height:210px;
            background-color:#cccccc;
            background-size: cover;
            background-position: center center;
            background-repeat: no-repeat;
            /*float: left;*/
            margin-right: 10px;
            text-align: center;
            padding-top: 110px;
        }
        .img_list .item img{

        }
        .scale{
            display: block;
        }
        .btn-close{
            position: absolute;
            z-index:1;
            top:0;
            right:0;
            color: #ffffff;
            width: 24px;
            height:24px;
            line-height: 24px;
            background: rgba(0,0,0,.75);
            text-align: center;
            cursor: pointer;
        }
        a.btn-close:hover{
            background: rgba(0,0,0,.55);
            color: #ffffff;
        }
        .img_list img{
            /*width: 100%;*/
        }
        .btn-download{
            display: none;
        }

        .cancel a:before{
            content: "\e014";
        }
    </style>
</head>
<body>
<section class="content-header">
    <h1>
        教师管理
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li><a href="#">教师管理</a></li>
        <li class="active">教师列表</li>
    </ol>
</section>
<!-- Main content -->
<section class="content">

    <div class="row">
        <!-- BEGIN SAMPLE TABLE PORTLET-->
        <div class="col-md-12">
            <!-- BEGIN SAMPLE TABLE PORTLET-->
            <div class="box-body">
                <div class="panel panel-default no-margin">
                    <div class="panel-body search-box">
                        <form id="formSearch" class="form-horizontal">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="txt_search_teacherName" class="col-sm-4 control-label">教师名称</label>
                                    <div class="col-sm-8">
                                        <input id="txt_search_teacherName" name="username" class="form-control"
                                               type="text" value="" placeholder="请输入教师名称">
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label"></label>
                                    <div class="col-sm-9">
                                        <button type="button" class="btn btn-default" id="btn-search"
                                                onclick="clickSearch()"><i class="fa  fa-search"></i>
                                            查询
                                        </button>
                                    </div>
                                </div>
                            </div>

                        </form>
                    </div>
                </div>

                <div id="teacherTableToolbar">
                    <button id="btn_add" type="button" class="btn btn-primary">
                        <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增教师
                    </button>
                    <button id="btn_excel_import" type="button" class="btn btn-primary ft-btn">
                        <span class="fa fa-file-excel-o" aria-hidden="true"></span>导入教师
                    </button>
                </div>
                <div class="table-scrollable">
                    <table class="table-striped table-hover" id="teacherTable">

                    </table>
                </div>

                <div id="teacherDialog" class="hide">
                    <form id="frmMain" class="form-horizontal">
                        <div class="box-body" style="width: 99%">
                            <div class="form-group">
                                <label class="col-sm-3 control-label ">Excel表格</label>
                                <div class="col-sm-6">
                                    <input type="file" id="file_excel" name="file"/>
                                </div>
                                <div style="line-height: 31px">
                                    <a href="#" id="excelDownload" style="font-size: x-small">下载模板</a>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label necessary"></label>
                                <span class="col-sm-9">请勿修改模板中表格格式！</span>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label "></label>
                                <div id="importMsg" class="col-sm-9" style="color:red;">导入成功</div>
                            </div>
                        </div>
                    </form>
                </div><!-- /.modal -->

                <!--编辑教师弹出框-->
                <div id="teacherInfoDialog" class="hide">
                    <form id="frmMainInfo" class="form-horizontal bv-form">
                        <div class="box box-primary no-margin">
                            <div class="box-header with-border">
                                <h3 class="box-title">教师基础信息</h3>
                                <div class="box-tools pull-right">
                                    <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                                </div>
                            </div>

                            <div class="box-body">
                                <input type="hidden" id="id" name="id" value="">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="organization" class="col-sm-2 control-label">登录账号</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="username" name="username" placeholder="请输入登录账号">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="teacherNumber" class="col-sm-2 control-label necessary">教师编号</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="teacherNumber" name="teacherNumber" placeholder="请输入教师编号">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="truename" class="col-sm-2 control-label necessary">教师姓名</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="truename" name="truename" placeholder="请输入教师姓名">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="roleId" class="col-sm-2 control-label necessary">教师类别</label>
                                            <div class="col-sm-10">
                                                <select class="form-control" name="roleId" id="roleId">
                                                    <option value="2">主讲老师</option>
                                                    <option value="3">学管主任</option>
                                                    <option value="7">学管师</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6" id="organizationDiv">
                                        <div class="form-group">
                                            <label for="organization" class="col-sm-2 control-label necessary">所属机构</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="organization" name="organization" placeholder="请输入所属机构">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="sex" class="col-sm-2 control-label necessary">性别</label>
                                            <div class="col-sm-10">
                                                <select class="form-control" name="sex" id="sex">
                                                    <option value="1">男</option>
                                                    <option value="2">女</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="phone" class="col-sm-2 control-label">手机号码</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="phone" name="phone" placeholder="请输入手机号码">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="email" class="col-sm-2 control-label">邮箱地址</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="email" name="email" placeholder="请输入邮箱地址">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="location" class="col-sm-2 control-label necessary">所在省市</label>
                                            <div class="col-sm-5">
                                                <select class="form-control" name="provinceId" id="provinceId">
                                                    <option value="">--请选择省--</option>
                                                </select>
                                            </div>
                                            <div class="col-sm-5">
                                                <select class="form-control" name="location" id="location">
                                                    <option value="">--请选择市--</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="address" class="col-sm-2 control-label">联系地址</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" id="address" name="address" placeholder="请输入联系地址">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="teacherIntro" class="col-sm-2 control-label">教师简介</label>
                                            <div class="col-sm-10">
                                        <textarea class="form-control" id="teacherIntro" name="teacherIntro" rows="5"
                                                  placeholder="请输入教师简介..."></textarea>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                        <div class="box box-primary">
                            <div class="box-header with-border">
                                <h3 class="box-title">教师图片</h3>
                                <div class="box-tools pull-right">
                                    <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                                </div>
                            </div>

                            <div class="box-body">
                                <input type="hidden" id="teacherImg" name="teacherImg">
                                <input type="file" id="file" name="file"/>
                                <div class="mt-10" id="fileTips"><label class="necessary">仅请上传JPG,PNG,GIF格式图片，图片大小限3M</label></div>
                                <div class="img_list row no-margin" id="img_list">
                                </div>
                            </div>


                            <!--<div class="row txt-aln-c">-->
                                <!--<a class="btn btn-default" id="btn-back">返回</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-->
                                <!--<a class="btn btn-primary" id="btn-save">保存</a>-->
                            <!--</div>-->
                        </div>
                    </form>

                </div>

            </div>

        </div>
    </div>

</section>
<!-- REQUIRED JS SCRIPTS -->
<!-- jQuery 2.2.3 -->
<script src="../../superui/content/ui/global/jQuery/jquery.min.js"
        th:src="@{/superui/content/ui/global/jQuery/jquery.min.js}"></script>
<!-- Bootstrap 3.3.6 -->

<script src="../../superui/content/ui/global/bootstrap/js/bootstrap.min.js"
        th:src="@{/superui/content/ui/global/bootstrap/js/bootstrap.min.js}"></script>
<!--supershopui-->
<script src="../../superui/content/min/js/supershopui.common.js"
        th:src="@{/superui/content/min/js/supershopui.common.js}"></script>

<!--bootstrap-table-->
<script src="../../superui/content/plugins/bootstrap-table/bootstrap-table.js"
        th:src="@{/superui/content/plugins/bootstrap-table/bootstrap-table.js}"></script>
<script src="../../superui/content/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.js"
        th:src="@{/superui/content/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.js}"></script>
<script src="../../js/assets/common/bootstrap-table-object.js"
        th:src="@{/js/assets/common/bootstrap-table-object.js}"></script>
<!--bootsrtap日历控件脚本-->
<script src="../../js/assets/lib/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js"
        th:src="@{/js/assets/lib/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js}"></script>
<script src="../../js/assets/lib/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"
        th:src="@{/js/assets/lib/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js}"></script>
<script src="../../js/assets/lib/bootstrap-datetimepicker/js/initDatetimepicker.js"
        th:src="@{/js/assets/lib/bootstrap-datetimepicker/js/initDatetimepicker.js}"></script>
<!-- bootstrap-switch -->
<script src="../../superui/content/plugins/bootstrap-switch/js/bootstrap-switch.min.js"
        th:src="@{/superui/content/plugins/bootstrap-switch/js/bootstrap-switch.min.js}"></script>
<script src="../../js/assets/common/Feng.js"
        th:src="@{/js/assets/common/Feng.js}"></script>
<!--价格格式化-->
<script src="http://cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>
<!-- iCheck -->
<script src="../../superui/content/plugins/iCheck/icheck.min.js"
        th:src="@{/superui/content/plugins/iCheck/icheck.min.js}"></script>
<!-- 分页脚本-->
<script src="../../js/assets/lib/pagination/jquery.pagination.js"
        th:src="@{/js/assets/lib/pagination/jquery.pagination.js}"></script>
<!-- 模板引擎-->
<script src="../../js/assets/lib/artTemplate/template.js"
        th:src="@{/js/assets/lib/artTemplate/template.js}"></script>
<!-- 请求脚本-->
<script src="../../js/assets/common/ajax-util.js"
        th:src="@{/js/assets/common/ajax-util.js}"></script>
<!-- 公用脚本-->
<script src="../../js/assets/common/common.js"
        th:src="@{/js/assets/common/common.js}"></script>
<!--上传控件-->
<script src="../../js/assets/lib/uploadify/jquery.uploadify.js"
        th:src="@{/js/assets/lib/uploadify/jquery.uploadify.js}"></script>
<script th:inline="javascript">
    /*<![CDATA[*/
    var baseUrl = [[${#httpServletRequest.getContextPath()}]];
    //    var baseUrl = [[@{/}]];
    if (baseUrl === '/') baseUrl = '';
    Feng.addCtx(baseUrl);
    /*]]>*/
</script>

<!-- 教师脚本-->
<script src="./../js/teacher/list/list.js"
        th:src="@{/js/teacher/list/list.js}"></script>
<script src="./../js/teacher/list/update_info.js"
        th:src="@{/js/teacher/list/update_info.js}"></script>


<script  type="text/html" id="dataTmpl">
    {{each}}
    <div class="item clearfix row">
        <div class="col-md-2 mb-20">
            <div class="teacher-img"><img class="" src="{{$value.teacherImg | pictureFormat}}"></div>
        </div>
        <div class="col-md-10">
            <div class="hd clearfix row no-margin">
                <div class="fl title">{{$value.truename}}</div>
                <div class="fr txt-aln-r">
                    <button class="btn btn-info btn-opt btn-sm" onclick="editBtn('{{$value.id}}')">
                        <i class="glyphicon glyphicon-edit"></i>
                        <span>编辑</span>
                    </button>
                    <button class="btn btn-danger btn-opt btn-sm" onclick="deleteBtn('{{$value.id}}','{{$value.truename}}')">
                        <i class="glyphicon glyphicon-trash"></i><span>删除</span>
                    </button>
                </div>
            </div>
            <div class="bd row mt-10 mb-10">
                <div class="col-md-4 no-padding">教师类别：{{$value.roleName}}</div>
                <div class="col-md-4 no-padding">联系电话：{{$value.phone}}</div>
                <div class="col-md-4 no-padding">邮箱地址：{{$value.email}}</div>
                <div class="col-md-4 no-padding">联系地址：{{$value.address}}</div>
                <div class="col-md-4 no-padding">创建时间：{{$value.createDate | dateFormat}}</div>
            </div>
        </div>
    </div>
    {{/each}}
</script>
</body>
</html>